﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Index.cshtml";
}

<style>
    table tr td {
        padding-left: 15px;
    }

    table tbody tr td {
        height: 20px;
    }

    .form-control {
        display: block;
        /*width: 100%;*/
        /*height: 34px;*/
        width: 53px;
        height: 20px;
        font-size: 10px;
        text-align: center;
        line-height: 1.42857;
        color: rgb(85, 85, 85);
        background-color: rgb(255, 255, 255);
        background-image: none;
        box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
        padding: 8px 19.5px;
        border-width: 1px;
        border-style: solid;
        border-color: rgb(221, 221, 221);
        border-image: initial;
        border-radius: 4px;
        transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    }
</style>
<div class="gridPanel">

    <table id="gridList" class="table table-bordered table-hover" style="table-layout:fa">
        <thead>
            <tr>
                <th style="text-align:center">序号</th>
                <th style="text-align:center">箱号</th>
                <th style="text-align:center">箱主</th>
                <th style="text-align:center">封号</th>
                <th style="text-align:center">蓬布号</th>
                <th style="text-align:center">备注</th>
                <th style="text-align:center">操作</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <input type="text" class="form-control xuhao" value="1">
                </td>
                <td>
                    <input type="text" class="form-control CarriageBoxID" value="">
                </td>
                <td>
                    <select class="form-control BoxType"></select>
                </td>
                <td>
                    <input type="text" class="form-control FenHao" value="">
                </td>
                <td>
                    <input type="text" class="form-control Tarpaulin" value="">
                </td>
                <td>
                    <input type="text" class="form-control Remark" value="">
                </td>
                <td>
                    <input type="button" class="form-control addnewlen" value="添加一行" />
                </td>
            </tr>
        </tbody>
    </table>
    <div id="gridPager" style="text-align: center; display: block;">
        <input type="button" class="form-control addnewlen" value="添加一行" style="float: left;margin-left:5px" />
        @*<input type="button" class="form-control" id="submitId" value="确认添加" onclick="SubmitThisInfo();" style="float: left;margin-left:20px" />*@
    </div>
</div>
<script src="~/Content/js/guangbiao/GuangBiaoMove.js"></script>
<script>
    //鼠标移动上下左右换行
    tabTableInput("gridList", "text");
    var keyValue = decodeURI($.request("keyValue"));
    var newJYDDIndex = 1;
    var carBoxList = '@ViewBag.CarBoxList';
    debugger;
    var viewBagboxType = '@ViewBag.BagboxType';
    var bagboxTypelist;
    var bagboxTypeliststr = '';
    var tempbagboxTypeliststr = '';

    var reg = new RegExp('&quot;', "g")
    var carBoxObjList;
    carBoxList = carBoxList.replace(reg, "\"");
    carBoxObjList = JSON.parse(carBoxList);
 

    $(function () {
        viewBagboxType = viewBagboxType.replace(reg, "\"");
        bagboxTypelist = JSON.parse(viewBagboxType);
        $.each(bagboxTypelist, function (i) {
            bagboxTypeliststr += "<option value='" + bagboxTypelist[i].Name + "'>" + bagboxTypelist[i].Name + "</option>";
        });
        $(".BoxType").append(bagboxTypeliststr);

        if ($(carBoxObjList).length > 0) {
            $("#gridList tbody").children().remove();
            $(carBoxObjList).each(function (index, item) {
                tempbagboxTypeliststr = '';
                $.each(bagboxTypelist, function (i) {
                    debugger;
                    if (item.BoxType == bagboxTypelist[i].Name) {
                        tempbagboxTypeliststr += "<option value='" + bagboxTypelist[i].Name + "' selected=\"selected\" >" + bagboxTypelist[i].Name + "</option>";
                    } else {
                        tempbagboxTypeliststr += "<option value='" + bagboxTypelist[i].Name + "'>" + bagboxTypelist[i].Name + "</option>";
                    }
                });
                $("#gridList tbody").append(
                    '<tr>  <td><input type="text" class="form-control xuhao"value="' +
                    newJYDDIndex + '" > </td><td> <input type="text" class="form-control CarriageBoxID" value="' + item.CarriageBoxID + '"></td>   <td> <select class= "form-control BoxType" >' + tempbagboxTypeliststr+'</select> </td > <td><input type="text" class="form-control FenHao" value="' + item.FenHao + '"> </td> <td><input type="text" class="form-control Tarpaulin" value="' + item.Tarpaulin + '"></td><td><input type="text" class="form-control Remark" value="' + item.Remark + '"></td> <td> <input type="button" class="form-control" value="删除当前行"  onclick=\'deleteTr(this);\'/> </td> </tr>');
                newJYDDIndex += 1;
            })
        }
        $(".addnewlen").click(function () {
            newJYDDIndex += 1;
            $("#gridList tbody").append(
                '<tr>  <td><input type="text" class="form-control xuhao"value="' +
                newJYDDIndex + '" > </td><td> <input type="text" class="form-control CarriageBoxID" value=""></td> <td> <select class= "form-control BoxType" >' + bagboxTypeliststr+'</select> </td >   <td><input type="text" class="form-control FenHao" value=""> </td> <td><input type="text" class="form-control Tarpaulin" value=""></td><td><input type="text" class="form-control Remark" value=""></td> <td> <input type="button" class="form-control" value="删除当前行"  onclick=\'deleteTr(this);\'/> </td> </tr>');
            //每次添加一行数据调用这个方法
            tabTableInput("gridList", "text");
        });

    });

    function deleteTr(nowTr) {
        $(nowTr).parent().parent().remove();
        newJYDDIndex = newJYDDIndex - 1;
    }

    function SubmitThisInfo() {
        debugger;
        $("#submitId").attr("disabled", "disabled");
        var arr = [];
        var trs = $("#gridList tbody tr");
        if (trs.length <= 0) {
            top.alert("请添加数据", function (i) {
                top.close(i);
            });
            return false;
        }
        var flag = 0;
        trs.each(function () {
            debugger;
            var obj = {};
            obj.xuhao = $.trim($(this).find(".xuhao").val());
            obj.CarriageBoxID = $.trim($(this).find(".CarriageBoxID").val());
            obj.BoxType = $.trim($(this).find(".BoxType").val());
            obj.FenHao = $.trim($(this).find(".FenHao").val());
            obj.Tarpaulin = $.trim($(this).find(".Tarpaulin").val());
            obj.Remark = $.trim($(this).find(".Remark").val());
            obj.InitBelongCarriageId = keyValue;
            if (!$.trim(obj.xuhao) || !$.trim(obj.CarriageBoxID) || !$.trim(obj.BoxType) || !$.trim(obj.FenHao) || !$.trim(obj.Tarpaulin) || !$.trim(obj.Remark)) {
                flag = 2;
                return false;
            }
            arr.push(obj);
        });

        switch (flag) {
        case 2:
            top.alert("传入数据为空", function (i) {
                top.close(i);
            });
                $("#submitId").attr("disabled", false);
            return false;
            break;
        }
        $.ajax({
            url: '/Project/PickCar/AddCarriageBoxList',
            data: { jsonData: JSON.stringify(arr) },
            dataType: "text",
            type: "POST",
            success: function (data) {
                var dataobj = JSON.parse(data);
                if (dataobj.code >= 1) {
                    top.alert("添加成功", function (i) {
                    });
                    $.modalClose(this);
                }
                else {
                    top.alert(dataobj.msg, function (i) {
                        $("#submitId").attr("disabled", false);
                        layer.close(i);
                    });
                }
            }
        });
    }
</script>